<?php
echo $this->javascript->link(array('jstree/jquery.cookie', 'jstree/jquery.hotkeys', 'jstree/jquery.jstree'));
echo $this->Html->css('jstree/style');
?>
<div id=search_tag>
	<h1>
		<img src="<?php echo $this->base ?>/assets/images/icon_searchtag.png" alt="icon_searchtag" width="81" height="81" />
		search tag tree
	</h1>


<div id="description">
<p>&nbsp;</p>

<!-- the tree container (notice NOT an UL node) -->
<div id="tag_tree" class="tag_tree" style="height:1000px;overflow: hidden"></div>
<!-- JavaScript neccessary for the tree -->
<script type="text/javascript" class="source below">
var firstClickOnNode = true;
$(function () {
$("#tag_tree")
	.bind("before.jstree", function (e, data) {
		$("#alog").append(data.func + "<br />");
	})
	.jstree({ 
		// List of active plugins
		"plugins" : [ 
			//"themes","json_data","ui","crrm","cookies","dnd","search","types","hotkeys","contextmenu" 
			"themes","json_data","cookies"
		],

		// I usually configure the plugin that handles the data first
		// This example uses JSON as it is most common
		"json_data" : { 
			// This tree is ajax enabled - as this is most common, and maybe a bit more complex
			// All the options are almost the same as jQuery's AJAX (read the docs)
			"ajax" : {
				// the URL to fetch the data
				"url" : "f_server",
				// the `data` function is executed in the instance's scope
				// the parameter is the node being loaded 
				// (may be -1, 0, or undefined when loading the root nodes)
				"data" : function (n) {
					// the result is fed to the AJAX request `data` option
					return { 
						"operation" : "get_children_in_fr", 
						"id" : n.attr ? n.attr("id").replace("node_","") : 1                                              
					}; 
				},
                                "success" : function (response_arr) {					
					//alert(response_arr[0].attr.id);
//                                        var tmp = response_arr[0].attr.id;
//                                        jQuery("#"+tmp+" > a").attr('href','http://example.com');
				}
			}
		},
/*
		// Configuring the search plugin
		"search" : {
			// As this has been a common question - async search
			// Same as above - the `ajax` config option is actually jQuery's AJAX object
			"ajax" : {
				"url" : "f_server",
				// You get the search string as a parameter
				"data" : function (str) {
					return { 
						"operation" : "search", 
						"search_str" : str 
					}; 
				}
			}
		},
*/
/*
		// Using types - most of the time this is an overkill
		// read the docs carefully to decide whether you need types
		"types" : {
			// I set both options to -2, as I do not need depth and children count checking
			// Those two checks may slow jstree a lot, so use only when needed
			"max_depth" : -2,
			"max_children" : -2,
			// I want only `drive` nodes to be root nodes 
			// This will prevent moving or creating any other type as a root node
			"valid_children" : [ "drive" ],
			"types" : {
				// The default type
				"default" : {
					// I want this type to have no children (so only leaf nodes)
					// In my case - those are files
					"valid_children" : "none",
					// If we specify an icon for the default type it WILL OVERRIDE the theme icons
					"icon" : {
						//"image" : "./file.png"
                                                "image" : "<?php echo $this->Html->img('jstree/file.png');?>"
					}
				},
				// The `folder` type
				"folder" : {
					// can have files and other folders inside of it, but NOT `drive` nodes
					"valid_children" : [ "default", "folder" ],
					"icon" : {
						//"image" : "./folder.png"
                                                "image" : "<?php echo $this->Html->img('jstree/folder.png');?>"   
					}
				},
				// The `drive` nodes 
				"drive" : {
					// can have files and folders inside, but NOT other `drive` nodes
					"valid_children" : [ "default", "folder" ],
					"icon" : {
						//"image" : "./root.png"
                                                "image" : "<?php echo $this->Html->img('jstree/root.png');?>"                                                
					},
					// those prevent the functions with the same name to be used on `drive` nodes
					// internally the `before` event is used
					"start_drag" : false,
					"move_node" : false,
					"delete_node" : false,
					"remove" : false
				}
			}
		},
*/
		// UI & core - the nodes to initially select and open will be overwritten by the cookie plugin

		// the UI plugin - it handles selecting/deselecting/hovering nodes
		"ui" : {
			// this makes the node with ID node_4 selected onload
                        "select_limit" : 1
//			"initially_select" : [ "node_4" ]
		},
		// the core plugin - not many options here
		"core" : { 
			// just open those two nodes up
			// as this is an AJAX enabled tree, both will be downloaded from the server
//			"initially_open" : [ "node_2" , "node_3" ] 
		}
	})
        .bind("select_node.jstree", function (event, data) { 
//            `data.rslt.obj` is the jquery extended node that was clicked
//            alert(data.rslt.obj.attr("id"));
            if(!firstClickOnNode)
                {
                    firstClickOnNode = true;
                    if(confirm("You really want to move the subject?"))
                        {
                            firstClickOnNode = true;
                            window.location = jQuery("#"+data.rslt.obj.attr("id")+" > a").attr("href") ;
                            firstClickOnNode = true;
                        }
                }                
            else
                {
                    firstClickOnNode = false;
                }             
        })
//        .bind("deselect_node.jstree", function (node ) { 	
//            window.location = "search?tag_id="+data.rslt.obj.attr("id");           
//        })
//	.bind("create.jstree", function (e, data) {
//		$.post(
//			"./server.php", 
//			{ 
//				"operation" : "create_node", 
//				"id" : data.rslt.parent.attr("id").replace("node_",""), 
//				"position" : data.rslt.position,
//				"title" : data.rslt.name,
//				"type" : data.rslt.obj.attr("rel")
//			}, 
//			function (r) {
//				if(r.status) {
//					$(data.rslt.obj).attr("id", "node_" + r.id);
//				}
//				else {
//					$.jstree.rollback(data.rlbk);
//				}
//			}
//		);
//	})
//.bind("reselect.jstree", function(event, data) {
//first = true;
//})
//.bind("select_node.jstree", function(event, data) {
//if(!first){
//return;
//}
//window.location.href =
//data.rslt.obj.children("a:eq(0)").attr("href");
//})
//REMOVE ALL ADMIN FUNCTIONs
/*	.bind("remove.jstree", function (e, data) {
		data.rslt.obj.each(function () {
			$.ajax({
				async : false,
				type: 'POST',
				url: "f_server",
				data : { 
					"operation" : "remove_node", 
					"id" : this.id.replace("node_","")
				}, 
				success : function (r) {
					if(!r.status) {
						data.inst.refresh();
					}
				}
			});
		});
	})
	.bind("rename.jstree", function (e, data) {
		$.post(
			"f_server", 
			{ 
				"operation" : "rename_node", 
				"id" : data.rslt.obj.attr("id").replace("node_",""),
				"title" : data.rslt.new_name
			}, 
			function (r) {
				if(!r.status) {
					$.jstree.rollback(data.rlbk);
				}
			}
		);
	})
	.bind("move_node.jstree", function (e, data) {
		data.rslt.o.each(function (i) {
			$.ajax({
				async : false,
				type: 'POST',
				url: "f_server",
				data : { 
					"operation" : "move_node", 
					"id" : $(this).attr("id").replace("node_",""), 
					"ref" : data.rslt.cr === -1 ? 1 : data.rslt.np.attr("id").replace("node_",""), 
					"position" : data.rslt.cp + i,
					"title" : data.rslt.name,
					"copy" : data.rslt.cy ? 1 : 0
				},
				success : function (r) {
					if(!r.status) {
						$.jstree.rollback(data.rlbk);
					}
					else {
						$(data.rslt.oc).attr("id", "node_" + r.id);
						if(data.rslt.cy && $(data.rslt.oc).children("UL").length) {
							data.inst.refresh(data.inst._get_parent(data.rslt.oc));
						}
					}
					$("#analyze").click();
				}
			});
		});
	});*/

});

$(document).ready(function() {
   firstClickOnNode = true;
 });

</script>
</div>

        
        <!--
	<ul id="tree">
		<li><a href="#"><strong>Animals / Plants / Life Forms (no food or people)</strong></a>
			<ul>
				<li><a href="#">Organisms That Currently Exist</a>
					<ul>
						<li><a href="#">Animals</a>
							<ul>
								<li><a href="#">Insects</a>
									<ul>
										<li><a href="#">Flying</a></li>
										<li><a href="#">Non-Flying</a></li>
									</ul>
								</li>
								<li><a href="#">Mammals</a></li>
								<li><a href="#">Amphibians</a></li>
								<li><a href="#">Reptiles</a></li>
								<li><a href="#">Birds</a></li>
								<li><a href="#">Fish</a></li>
								<li><a href="#">Invertebrates</a></li>
							</ul>
						</li>
						<li><a href="#">Plants</a></li>
						<li><a href="#">Microorganisms/Fungi</a></li>
						<li><a href="#">Organisms That Are Extinct</a></li>
						<li><a href="#">Fictional/Conceptual/Unsubstantiated Life Forms</a></li>
						<li><a href="#">Famous Animals</a></li>
					</ul>
				</li>
			</ul>
		</li>
		<li><a href="#"><strong>Places / Landmarks / Outer Space</strong></a></li>
		<li><a href="#"><strong>People / Characters and Groups / Bands / Teams</strong></a></li>
		<li><a href="#"><strong>Entertainment</strong></a></li>
		<li><a href="#"><strong>Something Else</strong></a></li>
		
	</ul>-->
	<!-- END OF TREE VIEW PLUGIN -->
	
</div>